let Vue;

class VueRouter {
  constructor(options) {
    this.$options = options

    // Vue.set(this, 'current', window.location.hash.slice(1))
    // this.current = window.location.hash.slice(1) || '/'
    const initial = window.location.hash.slice(1) || '/'
    Vue.util.defineReactive(this, 'current', initial)

    window.addEventListener('hashchange', this.hashchange)
    window.addEventListener('load', this.hashchange)

    this.routeMap = {}

    options.routes.forEach(item => {
      this.routeMap[item.path] = item
    })
  }

  hashchange = () => {
    // Vue.set(this, 'current', window.location.hash.slice(1))
    this.current = window.location.hash.slice(1)
  }

}

VueRouter.install = function (_Vue) {
  Vue = _Vue

  Vue.mixin({
    beforeCreate() {
      if (this.$options.router) {
        Vue.prototype.$router = this.$options.router
      }
    }
  })

  Vue.component('router-link', {
    props: {
      to: {
        type: String,
        required: true
      }
    },
    render(h) {
      return h('a', { attrs: { href: '#' + this.to } }, this.$slots.default)
    }
  })

  Vue.component('router-view', {
    render() {
      // console.log(this.$router.$options)
      // console.log(this.$router.current)
      console.log('router-view执行了', this.$router.routeMap)

      const {routeMap, current} = this.$router
      const Com = routeMap[current].component
      console.log(  Com )
      return <div><Com/></div>
      // let num = 10
      // if(this.$router.current) {
      //   num = this.$router.current
      // }
      // return <a>{num}</a>
    }
  })
}



export default VueRouter